<template>
    <el-menu default-active="2" class="el-menu-vertical-demo" :router="true" :unique-opened="true" :collapse="isCollapse"
        @open="handleOpen" @close="handleClose">
        <template v-for="item in menuItems" :key="item.index">
            <!-- 如果是子菜单 -->
            <el-sub-menu v-if="item.type === 'subMenu'" :index="item.index">
                <template #title>
                    <el-icon>
                        <component :is="item.icon" />
                    </el-icon>
                    <span>{{ item.title }}</span>
                </template>

                <!-- 子菜单项，添加路由跳转 -->
                <el-menu-item v-for="subItem in item.children" :key="subItem.index" :index="subItem.index"
                    :to="{ path: subItem.path }">
                    {{ subItem.title }}
                </el-menu-item>

            </el-sub-menu>

            <!-- 单个菜单项，添加路由跳转 -->
            <el-menu-item v-else-if="item.type === 'subMenu-item'" :index="item.index" :to="{ path: item.path }">
                <el-icon>
                    <component :is="item.icon" />
                </el-icon>
                <template #title>{{ item.title }}</template>
            </el-menu-item>
        </template>
    </el-menu>
</template>
  
<script setup>
import { ref } from 'vue'
import { useRouter } from 'vue-router';
import * as ElementPlusIconsVue from '@element-plus/icons-vue'

const router = useRouter()
const isCollapse = ref(false)
const menuItems = [
    // 首页
    {
        type: 'subMenu-item',
        index: '/home', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.HomeFilled,
        title: '首页'
    },
    // 入住登记
    {
        type: 'subMenu',
        index: '/admission', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '入住登记',
        children: [
            { index: '/admission/bed_registration', title: '家庭病床登记' },
            { index: '/admission/peaceful_care', title: '安宁疗护' },

        ],
    },
    // 评估管理
    {
        type: 'subMenu-item',
        index: '/assessment', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '评估管理'
    },
    // 在住管理
    {
        type: 'subMenu',
        index: '/residence_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '在住管理',
        children: [
            { index: '/residence_management/admission_management', title: '入住管理' },
            { index: '/residence_management/home_management', title: '居家管理' },
            { index: '/residence_management/peaceful_care', title: '安宁疗护' },
            { index: '/residence_management/nursing_transfer', title: '养转医' },
        ],
    },
    // 照护管理
    {
        type: 'subMenu',
        index: '/care_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '照护管理',
        children: [
            { index: '/care_management/bedside_care', title: '病床护理' },
        ],
    },
    // 护理管理
    {
        type: 'subMenu-item',
        index: '/nursing_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '护理管理'
    },
    // 医疗护理
    {
        type: 'subMenu',
        index: '/medical_care', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '医疗护理'
    },
    // 医疗护理（居家）
    {
        type: 'subMenu',
        index: '/medical_care_home', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '医疗护理（居家）',
        children: [

        ],
    },
    // 设备管理
    {
        type: 'subMenu-item',
        index: '/equipment_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '设备管理'
    },
    // 排班管理
    {
        type: 'subMenu',
        index: '/scheduling_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '排班管理',
        children: [
            { index: '/scheduling_management/nursing_shift_record', title: '护理值班记录' },
            { index: '/scheduling_management/nursing_handover', title: '护理交接班' },
            { index: '/scheduling_management/nurse_handover', title: '护士交接班' },
            { index: '/scheduling_management/nurse_shift_record', title: '护士值班记录' },
        ],
    },
    // 餐饮管理
    {
        type: 'subMenu',
        index: '/catering_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '餐饮管理',
        children: [
            { index: '/catering_management/order_register', title: '报餐送餐登记' },
            { index: '/catering_management/reporting', title: '餐饮报表' },
        ],
    },
    // 财务管理
    {
        type: 'subMenu-item',
        index: '/finance_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '财务管理'
    },
    // 床位管理
    {
        type: 'subMenu-item',
        index: '/bed_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '床位管理'
    },
    // 档案管理
    {
        type: 'subMenu-item',
        index: '/archive_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '档案管理'
    },
    // 质控管理
    {
        type: 'subMenu',
        index: '/quality_control', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '质控管理',
        children: [
            { index: '/quality_control/incident', title: '不良事件' },
            { index: '/quality_control/satisfaction_survey', title: '满意度调查' },
            { index: '/quality_control/data_reporting', title: '数据填报' },
            { index: '/quality_control/quality_evaluation_criteria', title: '质量评价标准' },
        ],
    },
    // 系统管理
    {
        type: 'subMenu',
        index: '/system_management', // 将原来的index值改为path的值
        icon: ElementPlusIconsVue.Location,
        title: '系统管理',
        children: [
            { index: '/system_management/system_users', title: '系统用户' },
            { index: '/system_management/permission_management', title: '权限管理' },
            { index: '/system_management/module_management', title: '模块管理' },
            { index: '/system_management/data_dictionary', title: '数据字典' },
            { index: '/system_management/attribute_configuration', title: '属性配置' },
            { index: '/system_management/institution_management', title: '机构管理' },
        ],
    },
]

const handleOpen = (key, keyPath) => {
    console.log(key, keyPath)
}

const handleClose = (key, keyPath) => {
    console.log(key, keyPath)
}
</script>
  
<style>
.el-menu-vertical-demo:not(.el-menu--collapse) {
    min-height: 100%;
}
</style>